import React, {Component} from 'react';
import {View, StyleSheet, TouchableOpacity, Image, Text} from 'react-native';
import Potato from '@greens/potato/src/potato'
import NavigationBar from '../../navigation/navigation-bar.view';
import ItemContent, {itemSelect} from "./index";

export default class ICDemo extends Potato {
    constructor(props) {
        super(props);
        this.state = {
            itemSelect:itemSelect.none
        };
        this.count = 0;
    }

    getItemStyles = (item, index) => {
        if (index === 0) {
            return {
                keyStyle: {
                    fontSize: 15,
                    color: '#dde111'
                }
            }
        }
        if (index === 3) {
            return {
                keyStyle: {
                    color: '#119111'
                },
                valueStyle: {
                    fontSize: 19,
                    color: 'blue',
                }
            }
        }
        if (index === 5) {
            return {
                keyStyle: {
                    fontSize: 15,
                    color: '#c12d32',
                    width:200
                },
                valueStyle: {
                    fontSize: 15,
                    color: 'red',
                },
                subValueStyle: {
                    fontSize: 12,
                    color: '#999999',
                }
            }
        }
    }

    clickEvent = () => {
        this.count++;
        if (this.count %2 ){
            this.setState({itemSelect:itemSelect.selected})
        }else {
            this.setState({itemSelect:itemSelect.unSelected})
        }
    }

    render() {

        let itemDataSource = [
            {
                key: '客户姓名',
                value: '激发科技'
            }, {
                key: '身份证号',
                value: '3301016918398929291'
            }, {
                key: '手机号码',
                value: '13067788992'
            }, {
                key: '征信状态',
                value: '拒绝'
            }, {
                key: '评估价状态状态状态状态状态状态状态状态状态状态',
                value: '以评估'
            }, {
                key: '业务员',
                value: '某某',
                subValue: '不是本公司的'
            }
        ]


        return (
            <View style={styles.container}>
                <NavigationBar title='item content'/>

                <ItemContent
                    dataSource={itemDataSource}
                    itemStyles={this.getItemStyles}
                    itemOnClick={this.clickEvent}
                    itemSelectStatus={this.state.itemSelect}
                />

            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#F6F6F6',
    },
});
